import React from 'react'
import {BrowserRouter as Router} from 'react-router-dom';
import logo from './images/logo.png'
import './user.css'
import Header from './Header.js'
import Content from './Content'
import mySearch from "./images/antOutline-search.png"
import myAddItem from "./images/antOutline-plus-circle.png"
import myEmail from "./images/antOutline-mail.png"
import myMessage from "./images/antOutline-message.png" 




const Search=()=>{
    return(
        <div className="navSerach">
            <input type="text" placeholder="请输入关键字" className="myInput"/>
            <img className="mySearch" src={mySearch}/>
            <div className="otherMessage">
                <img className="myAddItem" src={myAddItem}/>
                <img className="myEmail" src={myEmail}/>
                <img className="myMessage" src={myMessage}/>                
            </div>

        </div>
    )
}


const User = () => {
    return (
        <div>
            <div className="outerContainer">
            <div className="titleLogo"><img className="logo" src={logo}/></div>   
                <div className="Container">
                    <Router>
                        <div className="leftContainer"> 
                            <Header />
                        </div>
                        <div className="rightContainer">
                            <Search />
                            <div className="rightContent">
                                <Content />
                            </div>
                        </div>
                    </Router>
                </div>
            </div>
        </div>
    )
}

export default User
